<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>

<ul class="pic_list"></ul>
<script>
    /*images文件夹下有dress1.jpg , dress2.jpg, dress3.jpg,dress4.jpg系列图片,
    并有对应的描述文字：'长裙','短袖','连衣裙','淑女裙'.
    请用js代码实现：将图片用img标签、对应的描述文字用p标签, 逐个添加到上面的ul下的li列表项中。*/
    var images = ['dress1.jpg', 'dress2.jpg', 'dress3.jpg', 'dress4.jpg'];
    var desc = ['长裙', '短袖', '连衣裙', '淑女裙'];
    var ulElement = document.querySelector('.pic_list');

    for (var i = 0; i < images.length; i++) {
        var liElement = document.createElement('li');
        var imgElement = document.createElement('img');
        var pElement = document.createElement('p');

        imgElement.src = 'images/' + images[i];
        pElement.textContent = desc[i];
        liElement.appendChild(imgElement);
        liElement.appendChild(pElement);
        ulElement.appendChild(liElement);
    }
</script>
</body>
</html>

